// 频道管理模块
import { reqGetUSerChannels, reqGetAllChannels } from '@/api/channels'
const state = {
  // 我的频道的数据
  channels: [],
  // 所有频道的数据 所有频道数据不包含推荐频道
  allChannels: []
}
const mutations = {
  // 设置我的频道方法
  setMyChannels (state, channels) {
    state.channels = channels
  },
  // 设置所有频道mutation
  setAllChannels (state, allChannels) {
    state.allChannels = allChannels
  },
  // 新增我的频道
  addMyChannel (state, channel) {
    state.channels.push(channel)
  },
  // 移除我的频道
  delMyChannel (state, channel) {
    state.channels = state.channels.filter(item => item.id !== channel.id)
  }
}
// actions可以放任何异步操作, 不能直接修改state中状态 而是提交一个mutation
const actions = {
  // 我的频道的action
  async getChannels ({ commit }) {
    const { data: { channels } } = await reqGetUSerChannels()
    // console.log(channels)
    // 将我的频道保存在vuex中state中, 提交mutation
    commit('setMyChannels', channels)
  },
  // 所有频道的action
  async getAllChannels ({ commit }) {
    const { data: { channels } } = await reqGetAllChannels()
    // console.log(channels)
    // 提交mutation存储所有频道
    commit('setAllChannels', channels)
  }
}
// 基于state中数据派生出新的数据(状态)
const getters = {
  // 定义一个计算属性 基于我的频道 方式一
  // optionalChannels (state) {
  //   // 数组的过滤所有的频道 处理出来可渲染频道 filter 遇到true 就会将结果收集存储数组中
  //   return state.allChannels.filter(item => {
  //     let flag = true
  //     state.channels.forEach(channel => {
  //       if (item.id === channel.id) {
  //         flag = false
  //       }
  //     })
  //     return flag
  //   })
  // }
  // -----------------------------------------------------
  // some every filter  map reduce forEach find findIndex
  /*  optionalChannels () {
    return state.allChannels.filter(item => {
      const i = state.channels.findIndex(channel => {
        return item.id === channel.id
      })
      console.log(i)
      if (i === -1) {
        return true
      } else {
        return false
      }
    })
  } */
  // 方式二
  optionalChannels () {
    return state.allChannels.filter(item => state.channels.findIndex(channel => item.id === channel.id) === -1)
  }
}
export default {
  state,
  mutations,
  actions,
  getters,
  // 开启命名空间
  namespaced: true
}
